<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head lang="en">
		<meta charset="utf-8" />
		<title>个人信息</title>
		<link rel="stylesheet" type="text/css" href="<%=basePath%>frontPage/css/public.css"/>
		<link rel="stylesheet" type="text/css" href="<%=basePath%>frontPage/css/proList.css" />
		<link rel="stylesheet" type="text/css" href="<%=basePath%>frontPage/css/myorder.css" />
	    <script src="<%=basePath%>frontPage/js/jquery-1.12.4.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="<%=basePath%>frontPage/js/public.js" type="text/javascript" charset="utf-8"></script>
		<script src="<%=basePath%>frontPage/js/user.js" type="text/javascript" charset="utf-8"></script>
	    <script type="text/javascript">
	    
	        //获取商品id并写入到评论的隐藏域中
	    	function proComment(proId){
	    		$("#pdtId").val(proId);
	    	}
	    	
	    	//保持评论信息
	    	function saveComment(){
	    		var starNum = getStarNum();
	    		$("#cmRatingId").val(starNum);
	    		var commentInfo = $("#commentFormId").serialize();
	    		$.ajax({
					url:"<%=basePath%>insertMessage",
					type:"post",
					data:commentInfo,
					dataType:"json",
					success:function(data){	
						window.location.reload();
					},
					error:function(){
						
					}
				})
	    	}
	    	
	    	//获取打星的数量
	    	function getStarNum(){
	    	    var starNum = 0;
	    		$(".star").each(function(){
	    			var strSrc = this.src;
	    			if(strSrc.indexOf("hxin") >= 0){
	    				starNum++;
	    			}
	    		})  
	    		return starNum;
	    	}
	    </script>
	</head>
	<body>
		<!------------------------------head------------------------------>
		<jsp:include page="header1.jsp"></jsp:include>
		<!------------------------------idea------------------------------>
		<div class="address mt">
			<div class="wrapper clearfix">
				<a href="index.html" class="fl">首页</a>
				<span>/</span>
				<a href="myorderq.html" class="on">我的订单</a>
				<span>/</span>
				<a href="#" class="on">订单详情</a>
			</div>
		</div>
		
		<!------------------------------Bott------------------------------>
		<div class="Bott">
			<div class="wrapper clearfix">
				<div class="zuo fl">
					<h3>
						<a href="#"><img src="<%=basePath%>frontPage/img/tx.png"/></a>
						<p class="clearfix"><span class="fl">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;${user.name }</span></p>
					</h3>
					<div>
						<h4>我的交易</h4>
						<ul>
							<li><a href="<%=basePath%>toShoppingCartPage/${userId}">我的购物车</a></li>
							<li class="on"><a href="<%=basePath%>findOrderInfo/${userId}/5">我的订单</a></li>
							<li><a href="myprod.html">评价晒单</a></li>
						</ul>
						<h4>个人中心</h4>
						<ul>
							<li><a href="<%=basePath%>toAddressPage/${userId}">地址管理</a></li>
						</ul>
						<h4>账户管理</h4>
						<ul>
							<li><a href="<%=basePath%>tomymessagePage/${userId}">个人信息</a></li>
							<li><a href="<%=basePath%>changepassword/${userId}">修改密码</a></li>
						</ul>
					</div>
				</div>
				<div class="you fl">
					<div class="my clearfix">
						<h2>订单详情<a href="#">请谨防钓鱼链接或诈骗电话，了解更多&gt;</a></h2>
						<h3>订单号：<span>${orderInfo.orderId }</span></h3>
					</div>
					<div class="orderList">
						<div class="orderList1">
						    <c:if test="${orderInfo.status==0 }">
						    	<h3>待付款</h3>
						    </c:if>
							<c:if test="${orderInfo.status==1 }">
						    	<h3>待发货</h3>
						    </c:if>
						    <c:if test="${orderInfo.status==2 }">
						    	<h3>待收货</h3>
						    </c:if>
						    <c:if test="${orderInfo.status==3 }">
						    	<h3>待待评价</h3>
						    </c:if>
							<div class="clearfix">								
								<p class="fl"><a href="#">${orderInfo.pName }</a><a href="#">数量：${orderInfo.count } </a></p>
							</div>
						</div>
						<div class="orderList1">
							<h3>收货信息</h3>
							<p>姓 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名：<span>${orderInfo.name }</span></p>
							<p>联系电话：<span>${orderInfo.phone }</span></p>
							<p>收货地址：<span>${orderInfo.province }&nbsp;${orderInfo.city }&nbsp;${orderInfo.area }&nbsp;${orderInfo.addressInfo }</span></p>
						</div>
						<div class="orderList1">
							<h3>支付方式及送货时间</h3>
							<p>支付方式：<span>在线支付</span></p>
							<p>送货时间：<span>不限送货时间</span></p>
						</div>
						<div class="orderList1 hei">
							<h3><strong>商品总价：</strong><span>¥${orderInfo.money }</span></h3>
							<p><strong>运费：</strong><span>¥0</span></p>
							<p><strong>订单金额：</strong><span>¥${orderInfo.money }</span></p>
							<p><strong>实付金额：</strong><span>¥${orderInfo.money }</span></p>
						</div>	
						<div class="orderList1">
							<div class="table">
								<h3>订单详情信息</h3>						
								<c:forEach items="${orders }" var="order">
									<div class="th" style="display: flex; height: 146px;border-bottom: 1px dashed #dbdbdb;">				
										<div class="pro clearfix">										
											<a class="fl" href="#">
												<dl class="clearfix">
													<dt class="fl"><img src="<%=basePath%>/${order.ext1}" style="width: 100px;height: 100px;"></dt>
													<dd class="fl">
														<p>${order.proName }</p>
														<p>尺寸: ${order.odsSize }</p>														
													</dd>
												</dl>
											</a>
										</div>
										<div class="price">单价:￥${order.proPrice }</div>
										<div class="number">
											<p class="num clearfix">											
												数量:${order.odsNumber}	
											</p>
										</div>
										<div class="price sAll">总价:￥${order.proPrice*order.odsNumber }</div>
										<c:if test="${orderInfo.status==3}">
											<div class="price"><a class="del comments" onclick="proComment(${order.pdtId})">评价</a></div>
										</c:if>
									</div>
								</c:forEach>
							</div>
						</div>					
						
					</div>
					
					
				</div>
			</div>
		</div>
		<!-- 评价商品 -->
		<!--遮罩-->
		<div class="mask"></div>
		<!--评价弹框-->
		<div class="pj" style="margin: 0 auto;padding: 0 auto;">
			<div class="clearfix"><a href="#" class="fr gb"><img src="<%=basePath%>frontPage/img/icon4.png"/></a></div>
			<h3>商品评分</h3>
			<form action="#" method="get" id="commentFormId">
		        <input type="hidden" name="f_uid" value="${orderInfo.f_uid }"> 
		        <input type="hidden" name="phone" value="${orderInfo.phone }"> 
		        <input type="hidden" name="ext1" id="pdtId" value=""> 
		        <input type="hidden" name="ext2" id="cmRatingId" value="">
				<div class="clearfix">
					<p class="fl">请打分：</p>
					<p class="fl" id="xin">
						<a href="#2"><img class="star" src="<%=basePath%>frontPage/img/xin.png"/></a>
						<a href="#2"><img class="star" src="<%=basePath%>frontPage/img/xin.png"/></a>
						<a href="#2"><img class="star" src="<%=basePath%>frontPage/img/xin.png"/></a>
						<a href="#2"><img class="star" src="<%=basePath%>frontPage/img/xin.png"/></a>
						<a href="#2"><img class="star" src="<%=basePath%>frontPage/img/xin.png"/></a>
					</p>
				</div>
				<textarea name="content" rows="" cols="" placeholder="请输入评价" ></textarea>
				<div class="bc">
					<input type="button" onclick="saveComment()" value="保存"  />
					<input type="button" value="取消" />
				</div>
			</form>
		</div>
		
		<!--返回顶部-->
		<jsp:include page="gotop.jsp"></jsp:include>
		<!--footer-->
		<jsp:include page="footer.jsp"/>
		
	</body>
</html>
